﻿@model IEnumerable<Testicide.Models.Scenario>


<div style="margin-left:10px; margin-top:70px;">
    <div style="position:absolute; left:1px; top:98px; bottom:0px; width:240px; border-right:thin groove;">
        <ul id="menu">
            @foreach (var item in ViewBag.toolboxItems)
            {
                <li title="@item.Content" id="draggable" style="color:black; cursor:pointer; ">
                    <p id="@item.ID" draggable="true" ondragstart="event.dataTransfer.setData('text/plain',setdata(this))" ondragend="getID(this)">
                        @item.Title
                    </p>
                </li>
                <br />
            }
        </ul>
    </div>
   
    <div style="position:absolute; left:250px; top:98px; right:0; bottom:0px;">
            <p style="color:blue;margin-left:15px;"><b>Feature: @ViewBag.featureText</b></p>
        <button onclick="runAll()" style="width:130px; background-color:white; border:none; margin-right:100px; color:blue; text-decoration:underline;">Run All Scenarios</button>
        <div id="droppable" >
            <table>
                @if (Model != null)
                {
                    foreach (var item in Model)
                    {
                        <tr>
                            <td id="@item.Title">
                                <a class="confirmDialog" id="deleteScenario_@item.ID" href="@Url.Action("DeleteRecord", "Scenario", new { id = item.ID })">
                                    <img class="icons" src="~/pictures/delete.png" />
                                </a>
                                <textarea id="title+@item.ID" style="resize: none; overflow: hidden;height:25px; width:710px; font-weight:600; border: none; border-style: none;">@item.Title</textarea>
                            </td>
                            <td rowspan="3" style="margin-top:1px;">
                                <ul style="list-style-type: none; margin-right: 200px;">
                                    <li>
                                        <button id="@item.ID" class="run" onclick="getID2(this)" style="width:100px; background-color:white; border:none; float:right; margin-right:200px; color:blue;">Run Test</button>
                                    </li>
                                    <li>
                                        @if (item.Status == Testicide.Models.Scenario_Status.Fail)
                                        {
                                            <p id="result+@item.ID" style="color: red;"><b>Result: </b>Test @item.Status</p>
                                            <p style="color: red;">@item.Error_message</p>
                                        }
                                        else if (item.Status == Testicide.Models.Scenario_Status.Pass)
                                        {
                                            <p style="color: green;"><b>Result: </b>Test @item.Status </p>
                                        }
                                    </li>
                                </ul>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <ul style="list-style-type:none;">
                                    <li>
                                        <textarea class="searchtxt" id="txt+@item.ID" onclick="textAreaAdjust(this)" style="float:left; color:brown; font-family:Consolas; resize: none; width: 700px; overflow: hidden; border: none; border-style: none;">@item.Content</textarea>
                                    </li>
                                </ul>
                            </td>
                            <td></td>
                        </tr>
                        <tr style="height:35px;"><td></td></tr>
                    }
                }
            </table>
        </div>
    </div>
</div>           
<div id="dialog-confirm" style="display: none">
    <p>
        <span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>
        Are you sure to delete this Scenario ?
    </p>
</div>

@section Scripts
{
<script>
        $(document).ready(function () {
            $.ajaxSetup({ cache: false });
            $(".confirmDialog").click(function (e) {
                var url = $(this).attr('href');
                $("#dialog-confirm").dialog({
                    autoOpen: false,
                    resizable: false,
                    height: 180,
                    width: 350,
                    show: { effect: 'drop', direction: "up" },
                    modal: true,
                    draggable: true,
                    buttons: {
                        "OK": function () {
                            location.reload(true);
                            $(this).dialog("close");
                            window.location = url;
                        },
                        "Cancel": function () {
                            $(this).dialog("close");
                        }
                    }
                });
                $("#dialog-confirm").dialog('open');
                return false;
            });
        });
        function setLanguage(language) {
            var lang = language,
                url = '@Url.Action("Tool_Box","Scenario")';
            data = { language: lang };
            $.post(url, data);

        }
        function getID(item) {
            var itemID = item.id,
            url = '@Url.Action("HandleSelection", "Scenario")';
            data = { id: itemID };
            $.post(url, data, function () {
                location.reload(true);
            });
        }
        function getID2(item) {
            var itemID = item.id,
            itemtext = document.getElementById("txt+" + itemID).value;
            itemtitle = document.getElementById("title+" + itemID).value;
            url = '@Url.Action("getText/", "Scenario")';
            data = { scenarioId: itemID, text: itemtext, title: itemtitle };
            $.post(url, data, function () {
                location.reload(true);
            });
        }
        function runAll() {
            url = '@Url.Action("RunAll","Scenario")';
            $.post(url, null, function () {
                location.reload(true);
            });
        }
        function textAreaAdjust(o) {
            o.style.height = "1px";
            o.style.height = (25 + o.scrollHeight) + "px";
        }
        function setdata(item) {
            @*var itemID = item.id,
            url = '@Url.Action("HandleSelection", "Scenario")';
            data = { id: itemID };
            $.post(url, data, function () {
                location.reload(true);
            });*@
            var context = item.text;
            return context;
        }
        $(function () {
            $("#draggable").draggable({ revert: "invalid" });
            //$( "#draggable2" ).draggable({ revert: "invalid" });

            $("#droppable").droppable({
                activeClass: "ui-state-default",
                hoverClass: "ui-state-hover",
                drop: function (event, ui) {
                    $(this)
                      .addClass("ui-state-highlight")
                      .find("p")
                        .html("Dropped!");
                }
            });
        });
</script>

}